<template>
    <div>
        <div  class="lang-footer" :style="{marginBottom:$i18n.locale=='ru'?'2vw':''}">
            <div  class="left">
                <div  class="title">{{$t('h.add')}}</div>
                <div  class="msg">{{$t('h.address')}}</div>
                <div  class="zip">{{$t('h.zip')}}</div>
                <div  class="mail">{{$t('h.mail')}}</div>
                <div  class="btn">{{$t('h.contactUs')}}</div>
            </div>
            <div  class="cent">
                <div  class="title">{{$t('h.tel')}}</div>
                <div  class="phone"> 029-87368555 &nbsp;&nbsp;&nbsp;&nbsp; 029-87360777 </div>
                <div  class="mintitle">{{$t('h.ouristCom')}}</div>
                <div  class="phone">029-12345</div>
            </div>
            <div  class="rigth"><img  @click="goTop"
                    src="@/assets/img/top.png"
                    alt="" srcset="" class="img">
                <div  class="info"> {{$t('h.Copyright')}} </div>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    name: 'LangFooterS', // 组件名称
    data() {
        return {
            showTop: false,
        };
    },
    props: {

    },
    created() {
        console.log(2);

        this.scrollTop = window.scrollY
        if (this.scrollTop > 100) {
            this.showTop = true
        }
    },
    methods: {
        goPage(url) {
            if (this.$route.path == url) {
                return
            } else {
                this.$router.push(url)
            }

        },
        handleScroll() {
            if (window.scrollY > 100) {
                this.showTop = true
            } else {
                this.showTop = false  // 隐藏返回顶部按钮
            }
        },
        goTop() {
            window.scrollTo({ top: 0, behavior: 'smooth' });
        },
    },
    computed: {
        screenWidth() {
            return this.$store.getters.screenWidth
        }
    },
    watch: {
        // 监听器
    },
    mounted() {
        window.addEventListener('scroll', this.handleScroll);
    }
};
</script>

<style scoped>
.lang-footer {
    width: 100vw;
    height: 28.125vw;
    background-color: #1a1a1a;
    padding: 5.625vw 4.27083vw;
    display: -webkit-box;
    display: flex
;
    -webkit-box-pack: justify;
    justify-content: space-between;
}
.lang-footer .left {
    font-family: TimesNewRomanPSMT;
}
.lang-footer .left .title {
    font-size: 1.875vw;
    font-weight: normal;
    font-stretch: normal;
    line-height: 1.875vw;
    letter-spacing: 0px;
    color: #999999;
}
.lang-footer .left .msg {
    margin-top: 2.08333vw;
    font-size: 0.9375vw;
    font-weight: normal;
    font-stretch: normal;
    line-height: 1.5625vw;
    color: #ffffff;
}
.lang-footer .left .zip {
    margin-top: 4.16667vw;
    font-size: 0.9375vw;
    line-height: 1.5625vw;
    letter-spacing: 0px;
    color: #999999;
}
.lang-footer .left .mail {
    margin-top: 1.04167vw;
    font-size: 0.9375vw;
    font-weight: normal;
    font-stretch: normal;
    line-height: 1.5625vw;
    letter-spacing: 0px;
    color: #999999;
}
.lang-footer .left .btn {
    cursor: pointer;
    margin-top: 3.125vw;
    width: 10.83333vw;
    height: 3.64583vw;
    border: solid 0.10417vw #8a8a8a;
    font-size: 1.25vw;
    font-weight: normal;
    font-stretch: normal;
    line-height: 3.64583vw;
    letter-spacing: 0px;
    text-align: center;
    color: #999999;
}
.lang-footer .cent .title {
    font-size: 1.875vw;
    font-weight: normal;
    font-stretch: normal;
    line-height: 1.875vw;
    letter-spacing: 0px;
    color: #999999;
}
.lang-footer .cent .phone {
    margin-top: 2.08333vw;
    font-family: Arial-BoldMT;
    font-size: 2.60417vw;
    font-weight: bold;
    font-stretch: normal;
    line-height: 1.875vw;
    letter-spacing: 0px;
    color: #ffffff;
}
.lang-footer .cent .mintitle {
    margin-top: 2.39583vw;
    font-size: 0.9375vw;
    font-weight: normal;
    font-stretch: normal;
    line-height: 1.5625vw;
    letter-spacing: 0px;
    color: #999999;
}
.lang-footer .cent .phone:last-child {
    margin-top: 1.04167vw;
}
.lang-footer .cent .phone {
    margin-top: 2.08333vw;
    font-family: Arial-BoldMT;
    font-size: 2.60417vw;
    font-weight: bold;
    font-stretch: normal;
    line-height: 1.875vw;
    letter-spacing: 0px;
    color: #ffffff;
}
.lang-footer .rigth {
    text-align: right;
    position: relative;
}
.lang-footer .rigth .img {
    width: 3.64583vw;
    height: 3.64583vw;
    -o-object-fit: cover;
    object-fit: cover;
    cursor: pointer;
}
.lang-footer .rigth .info {
    position: absolute;
    bottom: 0;
    left: -28.64583vw;
    width: 32.65625vw;
    height: 0.88542vw;
    font-family: TimesNewRomanPSMT;
    font-size: 0.9375vw;
    font-weight: normal;
    font-stretch: normal;
    line-height: 1.5625vw;
    letter-spacing: 0px;
    color: #999999;
}
</style>